<template>
  <div>
    <van-nav-bar title="登录" left-text="菜单" @click-left="back">
      <template #left>
        <van-icon name="cross" size="24" />
      </template>
    </van-nav-bar>

    <van-form @submit="onSubmit">
      <van-field
        v-model="username"
        type="text"
        name="username"
        label="用户名"
        placeholder="用户名"
        :rules="[{ required: true, message: '请填写用户名' }]"
      />
      <van-field
        v-model="password"
        type="password"
        label="密码"
        name="password"
        placeholder="密码"
        :rules="[{ required: true, message: '请填写密码' }]"
      />
      <!-- <van-field
        v-model="Verification"
        type="text"
        label="验证码"
        name="Verification"
        placeholder="验证码"
        :rules="[{ required: true, message: '请填写验证码' }]"
      /> -->
      <div style="margin: 16px">
        <van-button round block type="info" native-type="submit"
          >登录</van-button
        >
      </div>
    </van-form>
    <van-notify v-model="show" type="danger">
  <van-icon name="cross" style="margin-right: 4px;" />
  <span>用户名或密码错误</span>
</van-notify>
  </div>
</template>

<script>
import axios from 'axios';
import { mapMutations } from 'vuex';
export default {

  name: "LoginPage",
  data() {
    return {
      show: false,
      username: "",
      password: "",
      // Verification: "",
      users: [
        {
          username: "admin",
          password: "123456",
          // Verification: "1234",
        },
      ],
    };
  },
  mounted() {
    if (window.innerWidth > 768) {
      // console.log(333);
      this.$router.push("/PCLogin");
    }
  },

  methods: {
    ...mapMutations(['setUsername']),
    ...mapMutations(['setChname']),
    ...mapMutations(['setUserId']),
    ...mapMutations(['setAuthority']),
      SaveUsername(username){
        // console.log("666"+this.list[0].course_id);
        this.setUsername(username);
      },
      SaveChname(chname){
        this.setChname(chname);
      },
      SaveUserId(id){
        this.setUserId(id);
      },
      SaveAuthority(authority){
        this.setAuthority(authority);
      },
      back() {
    this.$router.go(-1);
  },
    onSubmit() {
      axios.get('/user/login?username=' + this.username + '&password=' + this.password)
  .then(response => {
    const data = response.data;
    if (data.code === 200) {
      this.SaveUsername(response.data.data.username);
      this.SaveChname(response.data.data.chname);
      this.SaveUserId(response.data.data.id);
      // console.log(response.data.data.authority);
      this.SaveAuthority(response.data.data.authority);
      // console.log(response.data.data.authority);
      this.$router.push("/index");
    } else {
      alert("用户名或密码错误");
    }
  })
  .catch(error => {
    console.error('登录请求失败:', error);
  });
      },
    },
    ToSetting() {
      this.$router.push("/");
    },
    showNotify() {
      this.show = true;
      setTimeout(() => {
        this.show = false;
      }, 2000);
    },
    // ToIndex() {
    //   this.$router.push('/');
    // },
  }
</script>

<style scoped>
</style>